<template>
	<view>
		<view class="head">
			<image src="../../../static/icons/leju-logo.png" mode=""></image>
		</view>
		<view class="from">
			<view class="item">
				<input type="text" :value="user" />
			</view>
			<view class="item">
				<input type="password" :value="password" />
			</view>
			<view class="item" @tap="login">
				<text>登 录</text>
			</view>
		</view>
		<view class="sign">
			<text>找回密码</text>
			<text>|</text>
			<text @tap="jumpSign">注册账号</text>
		</view>
	</view>
</template>

<script>
	import { doLogin } from "../../../api/user/index.js"
	export default {
		data() {
			return {
				user:"17596496508",
				password:"123456"
			};
		},
		methods:{
			login() {
				var _this = this
				doLogin({
					username:_this.user,
					password:_this.password
				}).then(res=>{
					console.log(res)
					if (res.success == true) {
						uni.setStorageSync("token",res.data.token)
						uni.switchTab({
							url:"/pages/user/user"
						})
					}
				})
			},
			jumpSign() {
				uni.navigateTo({
					url:"/pages/user/login/sign/sign"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.head {
	width: 160rpx;
	height: 160rpx;
	border-radius: 50%;
	overflow: hidden;
	margin: 128rpx auto 72rpx;
	image {
		display: block;
		width: 100%;
		height: 100%;
	}
}
.from {
	padding: 24rpx 70rpx 0;
	.item {
		box-sizing: border-box;
		height: 100rpx;
		box-shadow: 0 0 60rpx 0 rgba(43,86,112,.1);
		border-radius: 2.5rem;
		margin-bottom: 48rpx;
		padding: 32rpx;
		color: #333;
		&:nth-child(2) {
			margin: 24rpx 0;
		}
		input {
			margin-left: 20rpx;
		}
		&:nth-child(3) {
			width: 600rpx;
			background-color: rgb(53, 78, 68);
			color: rgb(255, 255, 255);
			font-size: 30rpx;
			text-align: center;
			margin: 0 auto;
			margin-top: 120rpx;
		}
	}
}
.sign {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 64rpx;
	text {
		color: rgba(0,0,0,.7);
		font-size: 28rpx;
		&:nth-child(2) {
			font-size: 24rpx;
			margin: 0 14rpx;
		}
	}
}
</style>
